<template>
  <div class="pull-auto">
    <el-menu :default-active="activeIndex" mode="horizontal">
      <template v-for="(item,index) in topMenu">
        <el-menu-item  style="line-height: 50px;height: 50px;" :index="item.id+''" @click.native="openMenu(item)" :key="index">{{item.label}}</el-menu-item>
      </template>
    </el-menu>
  </div>
</template>

<script>
import { mapGetters } from 'vuex'
import { initMenu } from '@/util/util'
export default {
  name: 'top-menu',
  data() {
    return {
      activeIndex: '0'
    }
  },
  created() {},
  computed: {
    ...mapGetters(['tagCurrent', 'menu', 'topMenu'])
  },
  methods: {
    openMenu(item) {
      this.$store.dispatch('GetMenu', { menuID: item.id }).then(data => {
        initMenu(this.$router, data)
      })
    }
  }
}
</script>
